<template>
<view style="height: 100vh; background-color: #f6fafd;">	
	<view style="display: flex;align-items: center;  margin: 10rpx 10rpx;     background-color: rgba(255, 255, 255, 1);; ">
		<view class="search-bar" >
			<image class="search-icon" src="/static/u2326.png" mode=""></image>
			<input type="text" placeholder="搜索机构/医生" placeholder-style="color:#999" v-model="input"@input="onInput"  >
			</input>
		</view>
		<view class="search-button">
			<text style="width: 60rpx;
		height: 40rpx;" @click="toOrganization">取消</text>
		</view>
	</view>
	<view style="background-color: #f6fafd; " v-for="item in medicationData.rows" :key="item._id">
		<view class="search-box" @click="toTeamDoctor(item._id)">
			<text style="margin-left: 40rpx;">{{item.name}}</text>
			<image :src="item.image" mode="" style="width: 92rpx; height: 116rpx; flex-shrink: 0;margin-right: 40rpx;" class=""></image>
		</view>
	</view>
</view>
</template>

<script setup>
import { reactive, ref } from 'vue';
import { getMedicinesApi } from '../../../api/medication';

	import {
		onLoad
	} from '@dcloudio/uni-app';
const input = ref('')
	onLoad(() => {
    getMedicines ()
	})
	const onInput=()=>{
    getMedicines ()
		
	}
const medicationData = reactive({
		rows: [],
		total: 0
	});
	function getMedicines (){
		getMedicinesApi({
			name:input.value
		})
		.then(res=>{
			if(res.code==200){
				medicationData.rows=res.data.rows
				medicationData.total=res.data.total
			}
		})
	}
	function toTeamDoctor(_id) {
			uni.navigateTo({
				url: '/SignPackage/pages/drug-details/drug-details?_id=' + _id
			})
		}
</script>

<style>
	.search-positioning {
		position: relative;
		height: 100rpx;
	}
	.search-icon {
		width: 30rpx;
		height: 30rpx;
		margin-right: 10rpx;
	}
	.search-bar {
		display: flex;
		align-items: center;
		padding: 10rpx 20rpx;
		background-color: #fff;
		border-radius: 30rpx;
		margin: 20rpx;
		border: 1px solid #eee;
		width: 602rpx;
		height: 52rpx;
		margin: 20rpx auto;
	}
	.search-button {
		color: #999999;
	}
	.search-box{
		width: 670rpx;
		height: 188rpx;
		border: 1px solid #eee;
		display: flex;
		align-items: center;
		justify-content: space-between;
		background-color: rgba(255, 255, 255, 1);
		margin: 20rpx auto ;
	}
</style>
